﻿<!DOCTYPE html>
@model GN.Pay.Core.Values.PayNotifyData
@{
    Layout = null;
}
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        body, html {
            width: 100%;
        }

        html {
            font-size: 62.5%;
        }

        a {
            text-decoration: none;
            color: #000;
        }

        .success {
            width: 100%;
        }

            .success .goodsInfo {
                font-size: 1.6rem;
                margin: 3rem 0;
            }

                .success .goodsInfo .titles {
                    color: #111;
                    display: inline-block;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    line-height: 3rem;
                    height: 3rem;
                    padding-right: 2rem;
                }

                .success .goodsInfo .goodsName {
                    color: red;
                    display: inline-block;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    line-height: 3rem;
                    height: 3rem;
                    width: 16rem;
                }

            .success .imgBox {
                text-align: center;
            }

            .success img {
                width: 7rem;
                height: 7rem;
            }

            .success .imgInfos {
                font-size: 2.4rem;
                line-height: 5rem;
            }

        .timer {
            color: red;
            width: 2.4rem;
            line-height: 5rem;
            display: inline-block;
        }
    </style>
</head>
<body>
    <div class="success">
        <div class="goodsInfo">
            <p><span class="titles">订单号：</span><span class="goodsName">@Model.OrderNo</span></p>
            <p><span class="titles">订单主题： </span><span class="goodsName">@Model.Subject</span></p>
            <p><span class="titles">订单内容： </span><span class="goodsName">@Model.Body</span></p>
        </div>
        <div class="imgBox">
            <img src="~/Content/Wap/images/successPages.png" />
            <a href=""><p class="imgInfos">支付成功 <span class="timer">8</span> 正在跳转页面...</p></a>
        </div>
    </div>
    <script src="~/Scripts/jquery-2.1.4.min.js"></script>
    <script src="~/Scripts/jquery.signalR-2.2.1.js"></script>
    <script type="text/javascript">
        var count = 8;
        var timer = setInterval(function () {
            if (count == 0) {
                window.location.href = "/wap/PayRedirectResult?tradeNo=@Model.TradeNo";
                clearInterval(timer);
            } else {
                count--;
                $(".timer").html(count);
            }
        }, 1000)

        var connection = $.hubConnection();
        var notifyProxy = connection.createHubProxy('notifyHub');
        notifyProxy.on('notify', function (msg) {
            var obj = JSON.parse(msg);
            if (obj.state == 1) {
                clearInterval(timer);
                window.location.href = "/wap/PayRedirectResult?tradeNo=" + obj.tradeNo;
            }
        });
        connection.start().done(function () {
            notifyProxy.invoke('registerApply', '@Model.ApplyId');
        });
    </script>
</body>
</html>
